<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<script type="text/javascript">
			function search(){
				// var _uid=uid.value;
				//0、接收地址栏的uid的值
				//0.1、获取地址栏中的查询字符串对象
				var obj=new URLSearchParams(location.search);
				//0.2、通过这个对象的get方法获取对应的参数
				var _uid=obj.get("uid");
				var xhr=new XMLHttpRequest();
				xhr.open("GET",`/pro/v1/search/${_uid}`,true);
				xhr.onreadystatechange=function(){
					if(xhr.readyState==4&&xhr.status==200){
						var r=xhr.responseText;
						console.log(r);
						var arr=JSON.parse(r);
						// console.log(arr);
					  uname.value=arr[0].uname;
						//不写var，升级为全局变量
						//保存页面最开始的uname
						all_uname=arr[0].uname;
						upwd.value=arr[0].upwd;
						email.value=arr[0].email;
						phone.value=arr[0].phone;
						user_name.value=arr[0].user_name;
						if(arr[0].gender==1){
						 men.checked=true;
						}else if(arr[0].gender==0){
							women.checked=true;
						}else{
							buxiang.checked=true;
						}
					}
				}
				xhr.send();
			}
			function upd(){
				// var _uid=uid.value;
				//span如果为空，说明用户没有激活；uname文本框，如果用户激活uname文本框，就需要验证
				if(uname_msg.innerHTML==""){
					
				}else if(uname_msg.innerHTML!="√"){
					alert("用户名重复");return;
				}
				var obj=new URLSearchParams(location.search);
				var _uid=obj.get("uid");
				var xhr=new XMLHttpRequest();
				xhr.open("PUT",`/pro/v1/update`,true);
				xhr.onreadystatechange=function(){
					if(xhr.readyState==4&&xhr.status==200){
						var r=xhr.responseText;
						// d1.innerHTML=r;
						if(r==1){
							alert("修改成功");
							location.href="pro_list.html";
						}else{
							alert("修改失败");
						}
						
					}
				}
				var sex="-1";
				if(men.checked){
					sex="1";
				}else if(women.checked){
					sex="0";
				}else{
					sex="-1";
				}
				xhr.setRequestHeader("Content-Type","application/x-www-form-urlencoded")
				var formdata=`uid=${_uid}&uname=${uname.value}&upwd=${upwd.value}&email=${email.value}&phone=${phone.value}&user_name=${user_name.value}&gender=${sex}`;
				
				xhr.send(formdata);
			}
			function check_uname(){
				var _uname=uname.value;
				if(!_uname){
					uname_msg.innerHTML="用户名不能为空";return;
				}
				//用户名重复验证
				var xhr=new XMLHttpRequest();
				xhr.open("GET",`/pro/v1/getUname/${_uname}`,true);
				xhr.onreadystatechange=function(){
					if(xhr.readyState==4&&xhr.status==200){
						var r=xhr.responseText;
						//判断用户输入的用户名和页面最开始保存的用户名是否一致，如果一致，显示√
						if(r==1){
							if(_uname==all_uname){
								uname_msg.innerHTML="√";
							}else{
								uname_msg.innerHTML="用户名重复";return;
							}
						}else{
								uname_msg.innerHTML="√";
							}
					}
				}
				xhr.send();
			}
			
		</script>
	</head>
	<body onload="search()">
		<!-- 编码：<input type="text" id="uid" placeholder="请输入编码"> -->
		<!-- <button onclick="search()">查询</button><br> -->
		用户名：<input type="text" id="uname" placeholder="请输入用户名" onblur="check_uname()">
		<span id="uname_msg"></span><br>
		密码：<input type="text" id="upwd" placeholder="请输入用户密码"><br>
		电子邮箱：<input type="text" id="email" placeholder="请输入电子邮箱"><br>
		联系电话：<input type="text" id="phone" placeholder="请输入联系电话"><br>
		真实姓名<input type="text" id="user_name" placeholder="请输入真实姓名"><br>
		性别：<input type="radio" name="gender" id="men" checked="checked" value="1">
		<label for="men">男</label>
		<input type="radio" name="gender" id="women" value="0">
		<label for="women">女</label>
		<input type="radio" name="gender" id="buxiang" value="null">
		<label for="buxiang">不详</label><br>
		<button onclick="upd()">修改</button>
		
	</body>
</html>
